#include("../layout.html")
#@layout("撰写新文章")

#define head()
#[[
<style>
.tagchecklist {
	margin-left: 14px;
	font-size: 12px;
	overflow: auto;
}
.tagchecklist>li {
	float: left;
	margin-right: 25px;
	font-size: 13px;
	line-height: 1.8em;
	cursor: default;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-bottom: 6px;
}
.tagchecklist .ntdelbutton {
	position: absolute;
	width: 24px;
	height: 24px;
	border: none;
	margin: 0 0 0 -19px;
	padding: 0;
	background: 0 0;
	cursor: pointer;
	text-indent: 0;
}
.the-tagcloud {
	margin: 5px 0 10px;
	padding: 8px;
	border: 1px solid #ddd;
	line-height: 1.8em;
	word-spacing: 3px;
}
.the-tagcloud ul {
	margin: 0;
}
.the-tagcloud ul li {
	display: inline-block;
	margin-bottom: 6px;
}
.ui-autocomplete {
	padding: 0;
	margin: 0;
	list-style: none;
	position: absolute;
	z-index: 10000;
	border: 1px solid #5b9dd9;
	box-shadow: 0 1px 2px rgba(30,140,190,.8);
	background-color: #fff;
}
.ui-autocomplete li {
    margin-bottom: 0;
    padding: 4px 10px;
    white-space: nowrap;
    text-align: left;
    cursor: pointer
}
.ui-autocomplete li:hover {
    background-color: #0073aa;
    color: #fff
}
input[type=text].ui-autocomplete-loading {
    background-image: url(/assets/admin/css/images/loading.gif);
    background-size: 20px 20px;
    background-repeat: no-repeat;
    background-position: right center;
    visibility: visible
}
#set-post-thumbnail {
	display: inline-block;
	max-width: 100%;
}
#set-post-thumbnail img {
	max-width: 100%;
	height: auto;
	width: auto;
	vertical-align: top;
	background-image: linear-gradient(45deg,#c4c4c4 25%,transparent 25%,transparent 75%,#c4c4c4 75%,#c4c4c4),linear-gradient(45deg,#c4c4c4 25%,transparent 25%,transparent 75%,#c4c4c4 75%,#c4c4c4);
	background-position: 0 0, 10px 10px;
	background-size: 20px 20px;
}
</style>
]]#
#end

#define category(parents, key, depth)
	#for(x : parents[""+key+""])
	<li>
		<input type="checkbox" name="category" value="#(x.term_taxonomy_id)" title="#(x.name)" lay-skin="primary">
		#if(null != parents[""+x.term_id+""])
		<ul class="children" style="margin-left:18px;">
		#@category(parents, x.term_id, depth+1)
		</ul>
		#end
	</li>
	#end
#end

#define dropdown(parents, key, depth)
	#for(x : parents[""+key+""])
		<option value="#(x.term_taxonomy_id)">#(java.lang.String::join("", java.util.Collections::nCopies(depth, "— ")) + x.name)</option>
		#if(null != parents[""+x.term_id+""])
			#@dropdown(parents, x.term_id, depth+1)
		#end
	#end
#end

#define body()
<h1>撰写新文章</h1>

<div class="layui-fluid">
	<form class="layui-form" action="/admin/post/save" method="post">
		<input type="hidden" name="post_author" value="#(loginUser.ID)"/>
		<div class="layui-row layui-col-space15">
			<div class="layui-col-md9">
				<div class="layui-row layui-col-space15">
					<div class="layui-col-md12">
						<div>
							<input type="text" name="post_title" required lay-verify="required" placeholder="在此输入标题" autocomplete="off" class="layui-input"> 
						</div>
						<div id="edit-slug-box">
							<strong>固定链接：</strong>
							<span id="sample-permalink"><a href="http://localhost:8888/?p=20&amp;preview=true" target="wp-preview-20">http://localhost:8888/2019/03/23/<span id="editable-post-name">20</span>/</a></span>
							<span id="edit-slug-buttons"><a href="/admin/option/permalink" class="layui-btn layui-btn-xs layui-btn-primary">编辑</a></span>
							<span id="editable-post-name-full">20</span>
						</div>
					</div>
				</div>
				<div class="layui-row layui-col-space15">
					<div class="layui-col-md12">
						<div class="layui-tab">
					  		<ul class="layui-tab-title" style="text-align:right;border-bottom:none;">
					    		<li class="layui-this">可视化</li>
					    		<!-- <li>文本</li> -->
					  		</ul>
					  		<div class="layui-tab-content" style="padding:0;">
					    		<div class="layui-tab-item layui-show">
					    			<textarea id="tiny" name="post_content"></textarea>
					    		</div>
					    		<!-- <div class="layui-tab-item">
					    			<textarea id="layui" placeholder="请输入内容" class="layui-textarea layui-edit" style="height: 350px;"></textarea>
					    		</div> -->
					  		</div>
						</div>
					</div>
				</div>
			</div>
			<div class="layui-col-md3">
				<div class="layui-row layui-col-space15">
					<div class="layui-col-md12">
						<div class="layui-card">
						  	<div class="layui-card-header">发布</div>
						  	<div class="layui-card-body">
						  		<div id="minor-publishing-actions">
						  			<div id="save-action">
						  				<button id="save-post" class="layui-btn layui-btn-sm layui-btn-primary">保存草稿</button>
						  			</div>
						  			<div id="preview-action">
						  				<button id="post-preview" class="layui-btn layui-btn-sm layui-btn-primary">预览</button>
						  			</div>
						  			<div class="layui-clear"></div>
						  		</div>
						  		<div id="misc-publishing-actions">
						  			<div class="misc-pub-section layui-icon layui-icon-flag" style="font-size:13px;">
						  				<span>状态：</span>
						  				<span>草稿</span>
						  				<a href="#post_status" class="edit-post-status">编辑</a>
						  				<div id="post-status-select" style="display: none;">
											<input type="hidden" id="hidden_post_status" value="draft">
											<div class="layui-inline" style="width:100px;">
												<label for="post_status" class="screen-reader-text">设置状态</label>
												<select name="post_status" id="post_status">
													<option value="pending">等待复审</option>
													<option selected="selected" value="draft">草稿</option>
												</select>
											</div>
										 	<a href="#post_status" class="save-post-status layui-btn layui-btn-sm layui-btn-primary">确定</a>
										 	<a href="#post_status" class="cancel-post-status layui-btn layui-btn-sm layui-btn-primary" style="border:0;color:#0073aa;padding:0 2px;text-decoration:underline;">取消</a>
										</div>
						  			</div>
						  			<div class="misc-pub-section layui-icon layui-icon-auz" style="font-size:13px;">
						  				<span>公开度：</span>
						  				<span>公开</span>
						  				<a href="#visibility" class="edit-visibility">编辑</a>
						  				<div id="post-visibility-select" style="display: none;">
											<input type="hidden" id="hidden-post-password" value="">
											<!-- 
											<input type="checkbox" style="display:none;" name="hidden_post_sticky" id="hidden-post-sticky" value="sticky" lay-skin="primary">
											 -->
											<input type="hidden" id="hidden-post-visibility" value="public">
											
											<input type="radio" name="visibility" id="visibility-radio-public" value="public" checked="checked" title="公开" lay-filter="visibility"><br>
											<span id="sticky-span" style="margin-left:18px;">
												<input id="sticky" name="sticky" type="checkbox" value="true" title="将文章置于首页顶端" lay-skin="primary"><br>
											</span>
											
											<input type="radio" name="visibility" id="visibility-radio-password" value="password" title="密码保护" lay-filter="visibility"><br>
											<span id="password-span" style="display: none;">
												<label for="post_password">密码：</label> 
												<input type="text" name="post_password" id="post_password" value="" maxlength="255" class="layui-input">
											</span>
											
											<input type="radio" name="visibility" id="visibility-radio-private" value="private" title="私密" lay-filter="visibility"><br>
										
											<div class="layui-inline">
										 		<a href="#visibility" class="save-post-visibility layui-btn layui-btn-sm layui-btn-primary">确定</a>
										 		<a href="#visibility" class="cancel-post-visibility layui-btn layui-btn-sm layui-btn-primary" style="border:0;color:#0073aa;padding:0 2px;text-decoration:underline;">取消</a>
											</div>
										</div>
						  			</div>
						  			<div class="misc-pub-section layui-icon layui-icon-date" style="font-size:13px;">
						  				<span></span>
						  				<span>立即发布</span>
						  				<a href="#edit_timestamp" class="edit-timestamp">编辑</a>
						  				<div id="timestampdiv" style="display: none;margin:0;padding:0;">
											<div class="timestamp-wrap">
												<input type="text" name="post_date" id="post_date" value="#date(date, 'yyyy-MM-dd HH:mm:ss')" class="layui-input">
											</div>
											
											<div style="margin: 8px 0 0;">
												<a href="#edit_timestamp" class="save-timestamp layui-btn layui-btn-sm layui-btn-primary">确定</a>
												<a href="#edit_timestamp" class="cancel-timestamp layui-btn layui-btn-sm layui-btn-primary" style="border:0;color:#0073aa;padding:0 2px;text-decoration:underline;">取消</a>
											</div>
										</div>
						  			</div>
						  		</div>
						  		<div id="major-publishing-actions">
						  			<div id="delete-action">
						  				<a href="">移至回收站</a>
						  			</div>
						  			<div id="publishing-action">
						  				<button id="publish" type="submit" lay-submit lay-filter="*" class="layui-btn layui-btn-sm">发布</button>
						  			</div>
						  			<div class="layui-clear"></div>
						  		</div>
						  	</div>
						</div>
					</div>
				</div>
				<div class="layui-row layui-col-space15">
					<div class="layui-col-md12">
						<div class="layui-card">
						  	<div class="layui-card-header">形式</div>
						  	<div class="layui-card-body layui-form">
						  		<div class="layui-block">
						  			<input type="radio" name="post_format" value="0" title="标准" checked>
						  		</div>
						  		<div class="layui-block">
	      							<input type="radio" name="post_format" value="aside" title="日志">
	      						</div>
						  		<div class="layui-block">
	      							<input type="radio" name="post_format" value="image" title="图像">
	      						</div>
						  		<div class="layui-block">
	      							<input type="radio" name="post_format" value="video" title="视频">
	      						</div>
						  		<div class="layui-block">
	      							<input type="radio" name="post_format" value="quote" title="引语">
	      						</div>
						  		<div class="layui-block">
	      							<input type="radio" name="post_format" value="link" title="链接">
	      						</div>
						  		<div class="layui-block">
	      							<input type="radio" name="post_format" value="gallery" title="相册">
	      						</div>
						  		<div class="layui-block">
	      							<input type="radio" name="post_format" value="audio" title="音频">
	      						</div>
						  	</div>
						</div>
					</div>
				</div>
				<div class="layui-row layui-col-space15">
					<div class="layui-col-md12">
						<div class="layui-card">
						  	<div class="layui-card-header">分类目录</div>
						  	<div class="layui-card-body layui-form">
								<div class="layui-tab">
								  	<ul class="layui-tab-title">
								    	<li class="layui-this">所有分类目录</li>
								    	<li>最多使用</li>
								  	</ul>
								  	<div class="layui-tab-content" style="border: 1px solid #e6e6e6;border-top: none;">
								    	<div class="layui-tab-item layui-show">
								    		<ul>
								    			#@category(categories, 0, 0)
								    			<!-- <li><input type="checkbox" name="" title="未分类" lay-skin="primary"></li> -->
								    		</ul>
								    	</div>
								    	<div class="layui-tab-item">
								    		<ul>
								    			<li><input type="checkbox" name="" title="未分类" lay-skin="primary"></li>
								    		</ul>
								    	</div>
								  	</div>
								</div>
								<div>
									<a href="javascript:;" id="category-add-toggle" style="margin: 10px 0;"> + 添加新分类目录 </a>
									<p id="category-add" class="category-add" style="display: none; margin: 1em 0;">
										<label class="screen-reader-text" for="newcategory">添加新分类目录</label>
										<input type="text" id="newcategory" class="layui-input" value="新分类目录名" style="margin: 0 0 1em;">
										<label class="screen-reader-text" for="newcategory_parent">父级分类目录：</label>
										<select id="newcategory_parent">
											#@dropdown(categories, 0, 0)
										</select>
										<input type="button" id="category-add-submit" class="layui-btn layui-btn-sm layui-btn-primary" value="添加新分类目录" style="margin: 1em 0 0;">
									</p>
								</div>
						  	</div>
						</div>
					</div>
				</div>
				<div class="layui-row layui-col-space15">
					<div class="layui-col-md12">
						<div class="layui-card">
						  	<div class="layui-card-header">标签</div>
						  	<div class="layui-card-body">
						  		<div style="display: none;">
									<label for="tax-input-post_tag">添加或删除标签</label>
									<p><textarea name="tax_tag" id="tax-tag-post_tag"></textarea></p>
								</div>
						  		<div>
						  			<div class="layui-inline" style="width:180px;position:relative;">
						  				<input id="new-tag-post_tag" type="text" name="new_tag" placeholder="" autocomplete="off" class="layui-input" style="height:30px;">
										<ul class="ui-autocomplete" id="taglist" style="display: none;width:178px;top:34px;">
										</ul>
						  			</div>
						  			<div class="layui-inline">
						  				<button type="button" id="tagadd" class="layui-btn layui-btn-sm layui-btn-primary">添加</button>
						  			</div> 
						  			<p style="margin: 6px 0;">多个标签请用英文逗号（,）分开</p>
						  			<ul class="tagchecklist"></ul>
						  		</div>
					
						  		<div>
									<a href="javascript:;" id="link-post_tag"> 从常用标签中选择 </a>
									<div id="tagcloud-post_tag" class="the-tagcloud" style="display: none;">
										<ul class="wp-tag-cloud" role="list">
											<li><a href="#" role="button" class="tag-cloud-link tag-link-34 tag-link-position-1" style="font-size: 8pt;" aria-label="bbbb (1个项目)">bbbb</a></li>
											<li><a href="#" role="button" class="tag-cloud-link tag-link-36 tag-link-position-2" style="font-size: 8pt;" aria-label="bbbbbbbb (1个项目)">bbbbbbbb</a></li>
											<li><a href="#" role="button" class="tag-cloud-link tag-link-37 tag-link-position-3" style="font-size: 8pt;" aria-label="ccccccc (1个项目)">ccccccc</a></li>
										</ul>
									</div>
								</div>
						  	</div>
						</div>
					</div>
				</div>
				<div class="layui-row layui-col-space15">
					<div class="layui-col-md12">
						<div class="layui-card">
						  	<div class="layui-card-header">特色图片</div>
						  	<div class="layui-card-body">
						  		<p class="hide-if-no-js">
						  			<a href="" id="set-post-thumbnail" class="thickbox">
						  				<img width="150" height="150" src="http://localhost:8888/wp-content/uploads/2019/03/avatar.jpg" alt="">
						  			</a>
						  		</p>
						  		<p class="hide-if-no-js howto" id="set-post-thumbnail-desc">点击图片来修改或更新</p>
						  		<div>
									<a href="javascript:;" id="set-post-thumbnail"> 设置特色图片 </a>
								</div>
								<input type="hidden" id="_thumbnail_id" name="_thumbnail_id" value="21">
						  	</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</form>
</div>
#end

#define foot()
<script src='/assets/tinymce/tinymce.min.js'></script>
<script>
layui.cache.page = 'post';
layui.use(['laydate', 'tbynet'], function(){
	var $ = layui.$;
	var laydate = layui.laydate;
	var tbynet = layui.tbynet;
	
	tinymce.init({
	    selector: '#tiny',
	    language: 'zh_CN',
	    branding: false,
	    height: 400,
	    image_title: true,
	    automatic_uploads: true,
	    file_picker_types: 'file image media',
	    file_picker_callback: function(callback, value, meta) {
	    	var input = document.createElement('input');
	        input.setAttribute('type', 'file');
	        input.setAttribute('accept', 'image/*');

	        input.onchange = function () {
	          	var file = this.files[0];

	          	var reader = new FileReader();
	          	reader.onload = function () {
	            
	            	var id = 'blobid' + (new Date()).getTime();
	            	var blobCache =  tinymce.activeEditor.editorUpload.blobCache;
	            	var base64 = reader.result.split(',')[1];
	            	var blobInfo = blobCache.create(id, file, base64);
	            	blobCache.add(blobInfo);

	            	callback(blobInfo.blobUri(), { title: file.name });
	          	};
	          	reader.readAsDataURL(file);
	        };

	        input.click();
	    },
	    plugins: [
	      'advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker',
	      'searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking',
	      'save table contextmenu directionality emoticons template paste textcolor'
	    ],
	    toolbar: 'styleselect | bold italic forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | blockquote link image media | preview fullscreen'
	});
	tinymce.activeEditor.on('focus', function(e) {
		$('#tiny').val(tinymce.activeEditor.getContent());
	});
	tinymce.activeEditor.on('blur', function(e) {
		$('#tiny').val(tinymce.activeEditor.getContent());
	});
	
	//加载编辑器
  	/* tbynet.layEditor({
  		elem: '#layui'
  		,upload: {
  			url: '/admin/upload'
  			,size: 3
  		}
  	}); */
	
  	laydate.render({
  	    elem: '#post_date' //指定元素
  	    ,type: 'datetime'
  	});
	
});
</script>
#end